<!DOCTYPE html>
<html xmlns:th="http://www.thymeleaf.org">
<head>
    <meta charset="UTF-8">
    <title>智慧班牌</title>
    <style>
        *
        {
            font-family: "楷体";
        }
        .nav {
            display: flex; /* 使用 Flexbox 布局 */
            justify-content: space-around; /* 均匀分布在水平方向 */
            align-items: center; /* 垂直居中 */
        }

        .dropdown {
            position: relative;
        }

        .dropdown-content {
            display: none;
            position: absolute;
            background-color: #f9f9f9;
            min-width: 160px;
            box-shadow: 0px 8px 16px 0px rgba(0, 0, 0, 0.2);
            z-index: 1;
        }

        .dropdown-content a {
            color: black;
            padding: 12px 16px;
            text-decoration: none;
            display: block;
        }

        .dropdown-content a:hover {background-color: #f1f1f1}

        .dropdown:hover .dropdown-content {
            display: block;
        }
        body {
            text-align: center;
        }

        .timetable {
            width: 100%;
            margin: 20px auto;
            border-collapse: collapse;
            text-align: center;
        }
        .timetable th,
        .timetable td {
            padding: 10px;
            border: 1px solid #ddd;
        }
        .timetable th {
            background-color: #f2f2f2;
        }
        .timetable tr:nth-child(even) {
            background-color: #f9f9f9;
        }
        .timetable tr:hover {
            background-color: #f1f1f1;
        }
        .time-slot {
            font-weight: bold;
        }
    </style>
</head>
<body background="images/WEB.jpg"
      style=" background-repeat:no-repeat ;
background-size:100% 100%;
background-attachment: fixed">
<div class="nav-left" style="color:forestgreen"></div>
<div class="nav-right">
    <div class="nav-right-name" style="color:forestgreen">
        <dl class="nav-right-signout">
            <dd align="center">智慧+的校园体验</dd>
            <dd align="right"><button onclick="window.location.href='/login'">退 出 账 号</button></dd>
        </dl>
    </div>
</div>
<div class="nav">
    <div class="dropdown" style="color: cornflowerblue">
        <span>学生签到情况</span>
        <div class="dropdown-content">
            <a href="/Attendance">上学签到签退</a>
            <a href="/TimeControl">学生签到设置</a>
        </div>
    </div>
    <div class="dropdown" style="color: cornflowerblue">
        <span>班级信息</span>
        <div class="dropdown-content">
            <a href="/ClassTable">班级课表</a>
            <a href="/Teacher">教师队伍</a>
            <a href="/Score">班级成绩</a>
        </div>
    </div>
    <div class="dropdown" style="color: cornflowerblue">
        <span>班级相册</span>
        <div class="dropdown-content">
            <a href="/Photo">上传照片</a>
        </div>
    </div>
    <div class="dropdown" style="color: cornflowerblue">
        <span>班级形象</span>
        <div class="dropdown-content">
            <a href="#">宣传标语</a>
            <a href="#">今日之星</a>
        </div>
    </div>
</div>
<h2 style="text-align:center;">班级课程表</h2>
<table class="timetable">
    <thead>
    <tr>
        <th>Time Slot</th>
        <th>Monday</th>
        <th>Tuesday</th>
        <th>Wednesday</th>
        <th>Thursday</th>
        <th>Friday</th>
    </tr>
    </thead>
    <tbody>
    <tr>
        <td class="time-slot">8.35-9.10</td>
        <td>语文</td>
        <td>数学</td>
        <td>英语</td>
        <td>体育</td>
        <td>音乐</td>
    </tr>
    <tr>
        <td class="time-slot">9.20-9.55</td>
        <td>语文</td>
        <td>数学</td>
        <td>英语</td>
        <td>体育</td>
        <td>音乐</td>
    </tr>
    <tr>
        <td class="time-slot">10.35-11.10</td>
        <td>计算机网络</td>
        <td>数学</td>
        <td>英语</td>
        <td>体育</td>
        <td>音乐</td>
    </tr>
    <tr>
        <td class="time-slot">11.25-12.00</td>
        <td>语文</td>
        <td>数学</td>
        <td>英语</td>
        <td>体育</td>
        <td>音乐</td>
    </tr>
    <tr>
        <td class="time-slot">13.35-14.10</td>
        <td>语文</td>
        <td>数学</td>
        <td>英语</td>
        <td>体育</td>
        <td>音乐</td>
    </tr>
    <tr>
        <td class="time-slot">14.25-15.00</td>
        <td>语文</td>
        <td>数学</td>
        <td>英语</td>
        <td>体育</td>
        <td>音乐</td>
    </tr>
    <tr>
        <td class="time-slot">15.10-15.45</td>
        <td>语文</td>
        <td>数学</td>
        <td>英语</td>
        <td>体育</td>
        <td>音乐</td>
    </tr>
    </tbody>
</body>
</html>
